<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			body {
				background: #ccc;
			}

			#cloud {
				width: 22rem;
				height: 8rem;
				background: #f2f9fe;
				background: -webkit-linear-gradient(top, #f2f9fe 5%, d6f0fd 100%);
				background: linear-gradient(top, #f2f9fe 5%, d6f0fd 100%);
				border-radius: 100px;
				-webkit-animation: Floatingx 3s ease-in-out infinite;
				animation: Floatingx 3s ease-in-out infinite;
				position: relative;
				margin: 120px auto 20px;
			}

			#cloud:after,
			#cloud:before {
				content: "";
				position: absolute;
				background: #f2f9fe;
				z-index: -1;
			}

			#cloud:after {
				width: 100px;
				height: 100px;
				top: -50px;
				left: 50px;
				border-radius: 100px;
			}

			#cloud:before {
				width: 180px;
				height: 180px;
				top: -90px;
				left: 120px;
				border-radius: 200px;
			}

			.shadow {
				width: 350px;
				position: absolute;
				bottom: -25px;
				background: #000;
				-webkit-animation: scalex 3s ease-in-out infinite;
				animation: scalex 3s ease-in-out infinite;
				box-shadow: 0 0 25px 8px rgba(0, 0, 0, 0.4);
			}

			@-webkit-keyframes Floating {
				from {
					-moz-transform: translate(0, 0px);
				}

				65% {
					-moz-transform: translate(0, 15px);
				}

				to {
					-moz-transform: translate(0, 0px);
				}
			}

			@keyframes Floating {
				from {
					-moz-transform: translate(0, 0px);
				}

				65% {
					-moz-transform: translate(0, 15px);
				}

				to {
					-moz-transform: translate(0, 0px);
				}
			}

			@-webkit-keyframes Floatingx {
				from {
					-webkit-transform: translate(0, 0px);
				}

				65% {
					-webkit-transform: translate(0, 15px);
				}

				to {
					-webkit-transform: translate(0, 0px);
				}
			}

			@-webkit-keyframes scalex {
				from {
					-webkit-transform: scale(0.9);
				}

				65% {
					-webkit-transform: scale(1);
				}

				to {
					-webkit-transform: scale(0.9);
				}
			}
		</style>
	</head>
	<body>
		<div id="cloud">

			<span class="shadow"></span>
		</div>
	</body>
</html>
